<?php if (!defined('THINK_PATH')) exit();?><!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<title>项目练习</title>
<link href="/Q170614/0720/qqw/Public/web/css/bootstrap.min.css" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="/Q170614/0720/qqw/Public/web/css/animate.min.css" type="text/css">
<link href="/Q170614/0720/qqw/Public/web/css/css.css" rel="stylesheet" type="text/css">
</head>

<body>
<!-- header开始： -->
<!-- 导航条 -->
<nav class="navbar navbar-default navbar-fixed-top">
    <div class="container-fluid container">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false" id="list_btn">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
         	</button>
        	<a class="navbar-brand" href="#"><img src="/Q170614/0720/qqw/Public/web/images/logo.png" alt="logo"/></a>
        </div>
        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
            <ul class="nav navbar-nav navbar-right" id="nav">
                <li class="current"><a href="#index">首页</a></li>
                <li><a href="#item-list">论坛</a></li>
                <li><a href="#web">前端开发</a></li>
                <li><a href="#study">最新课程</a></li>
                <li><a href="#app">移动app</a></li>
                <li><a href="#contact_us">联系我们</a></li>
            </ul>
            <a href="<?php echo U('Admin/Index/index');?>">进入后台吧</a>
        </div><!-- /.navbar-collapse -->
    </div><!-- /.container-fluid -->
</nav>
<!-- content开始 -->
<!-- 巨幕 -->
<div class="jumbotron container-fluid" id="index">
    <div class="container wow slideInRight" data-wow-duration="1s" data-wow-delay="0s">
        <h1><?php echo $index['title'];?></h1>
        <p>本套课程适用于：1.WEB开发人员；2.网站维护人员、管理人员</p>
        <p>培训技能的目标：使用bootstrap框架快速构建响应式网页，颠覆传统WEB前端！</p>
    </div>
</div>
<!-- 安卓 -->
<div class="container content-list" id="item-list">
    <ul class="row list-content item">
        <li class="col-md-4 current wow slideInRight" data-wow-duration="1s" data-wow-delay="0s">
            <a href="#">
				<img src="/Q170614/0720/qqw/Public/web/images/content-pic.png" alt="pic"/>
				<h1>Android开发</h1>
				<span>Android开发技术交流、问题求助、实战案例分享</span>
			</a>
        </li>
        <li class="col-md-4 wow slideInRight" data-wow-duration="1s" data-wow-delay="0.5s">
           <a href="#">
				<img src="/Q170614/0720/qqw/Public/web/images/content-pic1.png" alt="pic"/>
				<h1>IOS开发</h1>
				<span>iOS开发技术交流，海量iOS实战干货分享</span>
            </a>
        </li>
        <li class="col-md-4 wow slideInRight" data-wow-duration="1s" data-wow-delay="1s">
           <a href="#">
				<img src="/Q170614/0720/qqw/Public/web/images/content-pic4.png" alt="pic"/>
				<h1>嵌入式底层开发</h1>
				<span>底层嵌入式开发、实战案例等技术交流讨论</span>
            </a>
        </li>
    </ul>
</div>
<!-- html5 -->
<div class="container-fluid content-web" id="web">
	<div class="container web-content">
    	<ul class="row">
            <li class="col-md-6 wow slideInRight" data-wow-duration="1s" data-wow-delay="0s">
                <h1>HTML5前端开发</h1>
                <span>一线资深前端开发工程师倾情打造！助你完成普通程序员到优秀工程师的华丽升级！</span>
                <ul class="web-intro text-left">
                    <li><span class="background"></span>使用HTML5与CSS3技术轻松实现设备自适应展示。</li>
                    <li><span class="background"></span>清晰明了的语义代码结构，更高的可读性、更利于页面维护的。</li>
                </ul>
            </li>
            <li class="col-md-6 pic wow slideInRight" data-wow-duration="1s" data-wow-delay="0.5s"><img src="/Q170614/0720/qqw/Public/web/images/content-pic2.png" alt="pic"/></li> 
        </ul>
    </div>
</div>
<!-- bootstrap -->
<div class="container content-list">
	<ul class="row content-bootstrap">
		<li class="col-md-6 pic wow slideInRight" data-wow-duration="1s" data-wow-delay="0s"><img src="/Q170614/0720/qqw/Public/web/images/content-pic3.png"></li>
		<li class="col-md-6 wow slideInRight" data-wow-duration="1s" data-wow-delay="0.5s"> 
			<h1>bootstrap实战视频教程</h1>
			<span>Bootstrap 是最受欢迎的HTML、CSS和JS框架，用于开发响应式布局、移动设备优先的WEB项目。</span>
			<ul class="web-intro text-left">
				<li><span class="background other"></span>你的网站和应用能在 Bootstrap 的帮助下通过同一份代码快速、有效适配手机、平板、PC、设备。</li>
				<li><span class="background other"></span>Bootstrap 提供了全面、美观的文档。你能在这里找到关于 HTML 元素、HTML 
          和 CSS 组件、jQuery 插件方面的所有详细文档。</li>
			</ul>
         </li>
	</ul>
</div>
<!-- join study -->
<div class="container-fluid content-web" id="study">
	<div class="container web-content">
    	<ul class="row" id="class_list">
            <li class="col-md-4 pic wow slideInRight" data-wow-duration="1s" data-wow-delay="0s">
               <img src="/Q170614/0720/qqw/Public/web/images/content-pic5.png"/>
               <a href="<?php echo U('Index/class_detail','id=10');?>" class="input-btn current"><button type="button">加入学习</button></a>
            </li>
            <li class="col-md-4 pic wow slideInRight" data-wow-duration="1s" data-wow-delay="0.5s">
               <img src="/Q170614/0720/qqw/Public/web/images/content-pic6.png"/>
               <a href="#" class="input-btn"><button type="button">加入学习</button></a>
            </li>
            <li class="col-md-4 pic wow slideInRight" data-wow-duration="1s" data-wow-delay="1s">
               <img src="/Q170614/0720/qqw/Public/web/images/content-pic5.png"/>
               <a href="#" class="input-btn"><button type="button">加入学习</button></a>
            </li>
            <li class="col-md-4 pic wow slideInRight" data-wow-duration="1s" data-wow-delay="0s">
               <img src="/Q170614/0720/qqw/Public/web/images/content-pic5.png"/>
               <a href="#" class="input-btn current"><button type="button">加入学习</button></a>
            </li>
            <li class="col-md-4 pic wow slideInRight" data-wow-duration="1s" data-wow-delay="0.5s">
               <img src="/Q170614/0720/qqw/Public/web/images/content-pic6.png"/>
               <a href="#" class="input-btn"><button type="button">加入学习</button></a>
            </li>
            <li class="col-md-4 pic wow slideInRight" data-wow-duration="1s" data-wow-delay="1s">
               <img src="/Q170614/0720/qqw/Public/web/images/content-pic5.png"/>
               <a href="#" class="input-btn"><button type="button">加入学习</button></a>
            </li>
        </ul>
        <div class="text-center">
            <button class="btn btn-default" id="load_more">加载更多</button>
        </div>
    </div>
</div>
<!-- app -->
<div class="container content-list" id="app">
	<ul class="row content-app">
		<li class="col-md-6 pic  wow slideInRight" data-wow-duration="1s" data-wow-delay="0s"><img src="/Q170614/0720/qqw/Public/web/images/content-pic10.png"></li>
		<li class="col-md-6  wow slideInRight" data-wow-duration="1s" data-wow-delay="0.5s"> 
			<h1>重庆经济学院移动APP下载</h1>
			<span>全新UI交互，与新网站数据同步，更加丰富的课程，开启精彩无限，语音搜索课程，喊出你想要的课程，一件收藏，方便自己重复学习，离线下载课程，在哪儿都能开！</span>
			<ul class="web-intro row">
				<li class="col-md-6"><a href="#"><img src="/Q170614/0720/qqw/Public/web/images/content-pic9.png"></a></li>
				<li class="col-md-6"><a href="#"><img src="/Q170614/0720/qqw/Public/web/images/content-pic8.png"></a></li>
			</ul>
         </li>
	</ul>
</div>
<!-- contact us -->
<div class="container-fluid content-us" id="content_us">
    <div class="container us-content">
        <div class="row">
            <div class="col-md-6  wow slideInRight" data-wow-duration="1s" data-wow-delay="0s">
                <h1>联系我们</h1>
                <p>经济学院是重庆经济技术有限公司旗下一个IT在线教育平台，目前已有30万注册用户，10万以上APP下载量，5000小时视频内容。 我们从不说空话，专注于IT在线教育，脱离传统教育的束缚，让你走哪学哪，想学就学。逗比的老师，贴心的助教，在这儿你能感受到来自五 湖四海伙伴们热情和踏实的学习态度！</p>
                <ul>
                    <li><img src="/Q170614/0720/qqw/Public/web/images/icon1.png">地址:重庆市大渡口区九宫庙软件园D5-11</li>
                    <li><img src="/Q170614/0720/qqw/Public/web/images/icon2.png">联系电话：028-68567913</li>
                    <li><img src="/Q170614/0720/qqw/Public/web/images/icon3.png">电子邮箱：985248952@qq.com</li>
                </ul>
            </div>
            <form action="" class="col-md-6 form-horizontal  wow slideInRight" data-wow-duration="1s" data-wow-delay="0.5s">
                <div class="form-group">
                    <div class="col-sm-6 name-btn">
                        <input type="text" placeholder="姓名" class="form-control">
                    </div>
                    <div class="col-sm-6">
                        <input type="text" placeholder="邮箱" class="form-control">
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-12">
                        <input type="text" placeholder="标题" class="form-control">
                    </div>
                </div>
                 <div class="form-group">
                    <div class="col-sm-12">
                        <textarea placeholder="内容" class="form-control"></textarea>
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-sm-12">
                        <input type="button" value="提交" class="submit-btn">
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>
<!-- content结束 -->
<!-- footer开始 -->
<div class="container">
    <p class="footer wow slideInRight" data-wow-duration="1s" data-wow-delay="0s">Copyright&nbsp;<i class="glyphicon glyphicon-copyright-mark"></i>&nbsp;2012-2015&nbsp;&nbsp;www.maiziedu.com&nbsp;&nbsp;蜀ICP备13014270号-4</p>
</div>
<!-- footer结束 -->
<script src="/Q170614/0720/qqw/Public/web/js/wow.min.js"></script>
<script src="/Q170614/0720/qqw/Public/web/js/jquery.min.js"></script>
<script src="/Q170614/0720/qqw/Public/web/js/bootstrap.min.js"></script>
<script src="/Q170614/0720/qqw/Public/web/js/jquery.nav.js"></script>
<script>
$(function(){
    // alert("");
    new WOW().init();                   //动画animate插件
    var wow = new WOW({                 //动画自定义配置
        offset: 100,
    });
    wow.init();

    $('#nav').onePageNav({              //单页平滑导航插件
        begin:function(){
            if($("#list_btn").css("display")!="none"){
                $("#list_btn").click();   //在执行之前给#list_btn一个直接点击事件，关闭按钮
            }
        },
    });

    changeFontsize();                 //网页一运行就让 字体自适应
    $(window).resize(function(){      //屏幕resize事件
        changeFontsize();
    });

    var fontSize="";
    function changeFontsize(){
        var clientWidth=document.body.clientWidth;
        fontSize=clientWidth*0.0116666666666667;
        $("html").css("font-size",fontSize+"px");   
    };
});
</script>
<!-- 加载更多ajax -->
<script>
$(function(){
    $("#load_more").on("click",function(){
        alert(1);
        $.ajax({
            url:"<?php echo U('Index/class_more');?>",
            type:"post",
            // data:{id:1},
            success:function(data){
                alert(2);
                // console.log(data);
                // {name:"zhang"}
                // object
                // json字符串json对象
                // alert(data);
                // alert(JSON.stringify(data));
                // alert(data[0].img);
                var str="";
                for (var i = 0; i < data.length; i++) {
                    str+="<li class=\"col-md-4 pic wow slideInRight\" data-wow-duration=\"1s\" data-wow-delay=\"1s\">";
                    str+="<img src=\""+data[i].img+"\"/>";
                    str+="<a href=\""+data[i].url+"\" class=\"input-btn\"><button type=\"button\">"+data[i].name+"</button></a>";
                    str+="</li>";
                }
                $("#class_list").append(str);
            }
        });
        alert(3);
    });
    
})
</script>
</body>
</html>